<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta charset="utf-8">
<title>我的优惠券</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<link href="res/common/css/Common.css" rel="stylesheet" />
<link href="res/common/css/coupon.css?v=1.1" rel="stylesheet" />
</head>
<style>
.tab-box {
display: table;
margin: 10px auto;
border: 1px solid #dcdcdc;
border-radius: 3px;
overflow: hidden;
}
.tab-box a {
display: inline-block;
width: 100px;
text-align: center;
color: #cc3333;
line-height: 40px;
background: #fff;
}
.tab-box .active {
color: #fff;
background: #d92521;
}
.hint_content {
width: 110px;
height: 130px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -65px;
margin-left: -55px;
background-image: url(images/hint.png);
background-size: 100% 100%;
}
</style>
<div id="onloading"></div>
<div id="loading" style="display: none;">
	<div class="loadingbox">
		<section class="ffffbox">
			<div class="loadingpice"></div>
		</section>
	</div>
</div>
<body>
	<div id="halldetail">
			<div class="tab-box">
						<input type="hidden" id="flag" value="2">
							<a href="javascript:;" id="a_1" class="active" onclick="changeDiv(1)">待使用(2)</a>
							<a href="javascript:;" id="a_2" class="${type eq 2?'active':'' }" onclick="changeDiv(2)">已使用(3)</a>
			</div>
			<div class="body" id="div_1">
			<ul class="list_coupon_ul">
						<li><a href="javascript:;">
							<p>25元洗车券</p>
							<p>
								天河XXXXX洗车店可用
							</p>
							<p>
							2017-07-01
							至
							2017-07-31
							</p>
							<p>剩余2张</p>
							<p onclick="getCoupon(this,event,'${item.mcardCouponId}','${item.shopId }')">使用</p>
							</a>
						</li>
						
							<li><a href="javascript:;">
							<p><span>30</span>减<span>5</span></p>
							<p>
								店内全部项目可用
							</p>
							<p>
							2017-07-01
							至
							2017-07-31
							</p>
							<p>剩余1张</p>
							<p onclick="getCoupon(this,event,'${item.mcardCouponId}','${item.shopId }')">使用</p>
							</a>
						</li>
			</ul>
		</div>
		
		<div class="body" id="div_2" style="display: none;">
			<ul class="list_coupon_ul">
							<li><a href="javascript:;">
							<p><span>30</span>减<span>10</span></p>
							<p>
								店内全部项目可用(21店通用)
							</p>
							<p>
							2017-07-01
							至
							2017-07-31
							</p>
							<p></p> 
							<p style="font-size:15px;line-height:15px;top:18px;width:20px;text-align:center;right:20px;">
									距截止10天
							</p>
							<!-- p style="top: 21px;">已过期</p -->
							</a>
						</li>
					
			</ul>
		</div>
		</div>
        <script>
            var footer = document.getElementById("footer_menu");
            var evtObj = {
                handleEvent: function(evt){
                    if("A" == evt.target.tagName){
                        evt.target.classList.toggle("on");
                    }
                }
            }
            footer.addEventListener("touchstart", evtObj, false);
            footer.addEventListener("touchend", evtObj, false);
        </script>
	</div>
	<input id="hidReturnUrl" name="hidReturnUrl" type="hidden" value="member/index" />
</body>

</html>
<script type="text/javascript" src="res/common/js/jquery-1.8.2.min.js"></script>
<script src="res/common/js/Layout.js"></script>
<script type="text/javascript">
	jQuery(function($) {
		var type="1";
		changeDiv(type);
		
	});
	function changeDiv(val){
		if(val==1){
			$("#div_1").css("display", "block");
			$("#div_2").css("display", "none");
			$("#a_1").attr("class", "active");
			$("#a_2").attr("class", "");
		}else{
			$("#div_1").css("display", "none");
			$("#div_2").css("display", "block");
			$("#a_2").attr("class", "active");
			$("#a_1").attr("class", "");
		}
	}
	function getCoupon(thi, evt, mcardCouponId,shopId){
		 var type=1;
		 var div=$("#div_1").css("display");
		 if(div=='none'){
			 type=2;
		 }
        evt.stopPropagation();
            $.get("shop/getCoupon?mcardCouponId=" + mcardCouponId +"&shopId="+shopId+"&type="+type, {}, function(rs){
           	 if (rs.code == "success") {
               	  window.location.href="member/coupon?type="+rs.result['type'];
                    } else {
                        alert(rs.result);
                    }
           }, 'json');
    }
</script>
